﻿<!doctype html>
<!--[if IE 7 ]>    <html lang="en-gb" class="isie ie7 oldie no-js"> <![endif]-->
<!--[if IE 8 ]>    <html lang="en-gb" class="isie ie8 oldie no-js"> <![endif]-->
<!--[if IE 9 ]>    <html lang="en-gb" class="isie ie9 no-js"> <![endif]-->
<!--[if (gt IE 9)|!(IE)]><!-->
<html lang="en-gb" class="no-js">
<!--<![endif]-->
<head>
    <meta charset="utf-8">
    <meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1">
    <!--[if lt IE 9]>
        <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
        <![endif]-->
    <title>优办公管理信息系统</title>
    {% load staticfiles %}
    <meta property="og:site_name" content="西安力啸网络科技有限公司" />
    <meta property="og:title" content="科技赋能未来" />
    <meta property="og:description" content=" 洞察 - 聚焦 - 创新" />
    <meta property="og:type" content="website" />
    <meta property="og:locale" content="zh_SG" />
    <meta name="twitter:card" content="summary" />
    <meta name="twitter:title" content="西安力啸网络科技有限公司" />
    <meta name="twitter:description" content="科技赋能未来" />
    <!--[if lt IE 9]>
            <script src="http://html5shim.googlecode.com/svn/trunk/html5.js"></script>
        <![endif]-->
    <!--[if lte IE 8]>
            <script type="text/javascript" src="http://explorercanvas.googlecode.com/svn/trunk/excanvas.js"></script>
        <![endif]-->
    <!--<link rel="stylesheet" type="text/css" href="{% static 'online/css/bootstrap.css' %}" />-->
    <link rel="stylesheet" type="text/css" href="{% static 'online/css/bootstrap.min.home.css' %}" />
    <!--<link rel="stylesheet" type="text/css" href="{% static 'online/css/styles.css' %}" />-->
    <style>
        .header {
            /* position: fixed; */
            width: 100%;
            background: transparent;
            z-index: 50;
            border-radius: 0;
            box-shadow: 0px 0px 14px #ccc;
            /* top: 35px; */
            transition: all 0.3s linear;
            -webkit-transition: all 0.3s linear;
            -moz-transition: all 0.3s linear;
            -o-transition: all 0.3s linear;
        }

        .container {
            padding-right: 15px;
            padding-left: 15px;
            margin-right: auto;
            margin-left: auto;
            width: 100%;
            max-width: 100%;
        }

        .header .navbar {
            margin: 0;
            /* background: #0074DB; */
            /* background: rgba(22, 22, 22, 0.7); */
            background: #FBFBFB;
            opacity: 0.9;
            border: 0;
            padding: 0px 0px;
        }

        .navbar {
            position: relative;
            z-index: 1000;
            min-height: 50px;
            margin-bottom: 20px;
            border: 1px solid transparent;
        }
        .navbar-collapse {
            max-height: 340px;
            padding-right: 15px;
            padding-left: 15px;
            overflow-x: visible;
            border-top: 1px solid transparent;
            box-shadow: inset 0 1px 0 rgba(255,255,255,0.1);
            -webkit-overflow-scrolling: touch;
        }

        .navbar-nav {
            margin: 7.5px -15px;
        }
        .navbar-collapse:before, .navbar-collapse:after {
            display: table;
            content: " ";
        }

        .navbar-collapse:before, .navbar-collapse:after {
            display: table;
            content: " ";
        }

        .navbar-collapse:after {
            clear: both;
        }

        .navbar-collapse:before, .navbar-collapse:after {
            display: table;
            content: " ";
        }

        .navbar-collapse:after {
            clear: both;
        }

        .navbar-collapse:before, .navbar-collapse:after {
            display: table;
            content: " ";
        }

        .header .navbar-nav > li > a {
            padding: 25px 18px;
        }

        .navbar-inverse .navbar-nav > li > a {
            /* color: #fff; */
            color: #787878;
            font-weight: bold;
            /*font-size: 1.2em;*/
            line-height: normal;
            margin: 17px;
            padding: 6px 0px !important;
            border-radius: 5px;
            font-family: 'Oswald', sans-serif;
            /* font-weight: 400; */
        }

        @media (min-width: 768px) {
            .navbar-header {
                float: left;
                border-right: 1px solid #ccc;
            }

            .navbar-collapse.collapse {
                display: block !important;
                height: auto !important;
                padding-bottom: 0;
                overflow: visible !important;
            }

            .navbar-collapse {
                width: auto;
                border-top: 0;
                box-shadow: none;
                flex-basis: auto;
                -ms-flex-align: unset;
                align-items: unset;
            }

            .navbar-nav {
                float: left;
                margin: 0;
            }

                .navbar-nav > li {
                    float: left;
                }

            .nav > li {
                position: relative;
                display: block;
            }

            .navbar-inverse .navbar-nav > li > a {
                /* color: #fff; */
                color: #787878;
                font-weight: bold;
                /*font-size: 1.1em;*/
                padding: 10px 0px !important;
                border-radius: 5px;
                /* margin: 34px 10px; */
                /* margin: 32px 10px; */
            }
            .navbar-nav > li > a {
                padding-top: 15px;
                padding-bottom: 15px;
            }
        }
        
        .nav > li > a {
            position: relative;
            display: block;
            padding: 10px 15px;
        }

        .navbar-nav {
            /* float: right; */
            float: left;
            margin-left:90px;
            flex-direction: unset;
        }
        
        .navbar-toggle {
            position: relative;
            float: right;
            padding: 9px 10px;
            margin-top: 8px;
            margin-right: 15px;
            margin-bottom: 8px;
            background-color: transparent;
            border: 1px solid transparent;
            border-radius: 4px;
        }

        .navbar-brand {
            float: left;
            padding: 15px 15px;
            font-size: 18px;
            line-height: 20px;
            padding-top: 15px !important;
        }
        .nav {
            padding-left: 0;
            margin-bottom: 0;
            list-style: none;
        }
        .downprofilediv {
            position: absolute;
            width: 100px;
            height: 140px;
            border: 1px solid #ccc;
            right: 30px;
            top: 80px;
            display: none;
        }
        .active a {
            background: none;
            color: #61c9d4 !important;
            border-bottom: 2px solid #61c9d4;
            border-radius: 0px;
        }
        .navbar-inverse .navbar-nav > li > a:hover, .navbar-inverse .navbar-nav > li > a:focus {
            /* color: #fff; */
            color: #61c9d4;
            border-bottom: 2px solid #61c9d4;
        }
    </style>
    <link rel="stylesheet" type="text/css" href="{% static 'online/css/stylehome.css' %}" />
    <link rel="stylesheet" type="text/css" href="{% static 'online/css/blue.css' %}" />

</head>

<body>

    <header class="header">
        <div class="container">
            <nav class="navbar navbar-inverse" role="navigation">
                <div class="navbar-header" style="width: 11.5%;min-width: 164px;">
                    <!--<button type="button" id="nav-toggle" class="navbar-toggle" data-toggle="collapse" data-target="#main-nav"> <span class="sr-only">Toggle navigation</span> <span class="icon-bar"></span> <span class="icon-bar"></span> <span class="icon-bar"></span> </button>-->

                    <a href="#" class="navbar-brand scroll-top logo"><b><i><img src="{% static 'online/images/logo_big.png' %}" /></i></b></a>
                </div>
                <!--/.navbar-header-->
                <div id="main-nav" class="" style="width:87%;float:left;">
                    <ul class="nav navbar-nav" id="mainNav">
                        <li class="active" id="firstLink"><a href="/online/index/" class="scroll-link">首页</a></li>
                        <li class="" id="firstLink"><a href="/online/rule/" class="scroll-link">规章制度</a></li>
                        <li class="" id="firstLink"><a href="/online/vacation/" class="scroll-link">请假管理</a></li>
                        <!--<li><a href="services.html" class="scroll-link">报销系统</a></li>-->
                    </ul>

                    <div type="" id="nav-toggle" class="navbar-toggle" data-toggle="" style="display:block;" data-target="#divprofile">
                        <!--onclick="profile()"-->
                        <img src="{% static 'online/images/profile2.png' %}" style="width:46px;height:44px;" />
                        <span style="color: #787878;font-weight: bold;" id="usernamespan">loading...</span>&nbsp;&nbsp;
                        <span style="color: #787878;font-weight: bold;cursor:pointer;" onclick="logout()">退出</span>
                        <!--<img src="{% static 'online/images/downdont.png' %}" id="profileimg" style="margin-left:10px;" />-->
                    </div>
                    <div style="" class="downprofilediv" id="divprofile">
                        <h5>个人信息</h5>
                        <h5>修改密码</h5>
                    </div>

                </div>
                <!--/.navbar-collapse-->
                <div style="clear:both;"></div>
            </nav>
            <!--/.navbar-->
        </div>
        <!--/.container-->
    </header>



    <!-- ============================================================== -->
    <!-- Preloader - style you can find in spinners.css -->
    <!-- ============================================================== -->
    <!--<div class="preloader">
        <svg class="circular" viewBox="25 25 50 50">
            <circle class="path" cx="50" cy="50" r="20" fill="none" stroke-width="2" stroke-miterlimit="10" />
        </svg>
    </div>-->
    <!-- ============================================================== -->
    <!-- Main wrapper - style you can find in pages.scss -->
    <!-- ============================================================== -->
    <div id="main-wrapper" style="margin-top:8px;">
        <!-- ============================================================== -->
        <!-- Page wrapper  -->
        <!-- ============================================================== -->
        <div class="page-wrapper">
            <!-- ============================================================== -->
            <!-- Container fluid  -->
            <!-- ============================================================== -->
            <div class="container-fluid">
                <!-- ============================================================== -->
                <!-- Start Page Content -->
                <!-- ============================================================== -->
                <!-- Row -->
                <div class="row">
                    <div class="col-lg-8">
                        <div class="card">
                            <div class="card-body">
                                <select class="custom-select pull-right">
                                    <option selected>2018</option>
                                </select>
                                <h4 class="card-title">项目状态</h4>
                                <div class="table-responsive m-t-20">
                                    <table class="table stylish-table">
                                        <thead>
                                            <tr>
                                                <th colspan="2">项目负责人</th>
                                                <th>项目名称</th>
                                                <th>项目优先级</th>
                                                <th>当前状态</th>
                                            </tr>
                                        </thead>
                                        <tbody>
                                            <tr>
                                                <td><span class="round round-primary">A</span></td>
                                                <td>
                                                    <h6>Aries Ai</h6><small class="text-muted">System Architect</small>
                                                </td>
                                                <td>Novartis LVD</td>
                                                <td><span class="label label-primary">High</span></td>
                                                <td>系统开发</td>
                                            </tr>
                                            <tr>
                                                <td><span class="round round-danger">B</span></td>
                                                <td>
                                                    <h6>Bella Li</h6><small class="text-muted">QA Manager</small>
                                                </td>
                                                <td>植保无人机APP</td>
                                                <td><span class="label label-danger">High</span></td>
                                                <td>系统设计</td>
                                            </tr>
                                            <tr>
                                                <td><span class="round"><span class="round">D</span></span></td>
                                                <td>
                                                    <h6>David Tang</h6><small class="text-muted">Project Manager</small>
                                                </td>
                                                <td>安全生产管理系统</td>
                                                <td><span class="label label-info">High</span></td>
                                                <td>系统交付</td>
                                            </tr>
                                            <tr>
                                                <td><span class="round round-success">M</span></td>
                                                <td>
                                                    <h6>Merlin Jing</h6><small class="text-muted">Project Manager</small>
                                                </td>
                                                <td>Novartis GEST</td>
                                                <td><span class="label label-success">High</span></td>
                                                <td>系统开发</td>
                                            </tr>
                                            <tr>
                                                <td><span class="round round-warning">D</span></td>
                                                <td>
                                                    <h6>Daisy Zhu</h6><small class="text-muted">Developer</small>
                                                </td>
                                                <td>滨江系统数据统计</td>
                                                <td><span class="label label-warning">Medium</span></td>
                                                <td>验收测试</td>
                                            </tr>
                                            <tr>
                                                <td><span class="round bg-inverse">J</span></td>
                                                <td>
                                                    <h6>Jason Mao</h6><small class="text-muted">Developer</small>
                                                </td>
                                                <td>优办公管理信息系统</td>
                                                <td><span class="label label-inverse">Medium</span></td>
                                                <td>系统开发</td>
                                            </tr>
                                        </tbody>
                                    </table>
                                </div>
                            </div>
                        </div>
                    </div>
                    <div class="col-lg-4">
                        <!-- Column -->
                        <div class="card">
                            <img class="" src="/static/online/images/profile-bg.jpg" alt="Card image cap">
                            <div class="card-body little-profile text-center">
                                <div class="pro-img"><img src="/static/online/images/users/alison.png" alt="user" /></div>
                                <h3 class="m-b-0">Alison - 张赛</h3>
                                <p>Web Designer &amp; UX Designer</p>
                                <p><small>生命是一场修行，只要有共鸣，无声亦动听，用创意温暖设计</small></p><p class="label label-danger">我要结婚啦 2018-8-18</p><br><a href="javascript:void(0)" class="m-t-10 waves-effect waves-dark btn btn-primary btn-md btn-rounded">八月之星</a>
                                <div class="row text-center m-t-20">
                                    <div class="col-lg-4 col-md-4 m-t-20">
                                        <h3 class="m-b-0 font-light">工作</h3><small>> 4年</small>
                                    </div>
                                    <div class="col-lg-4 col-md-4 m-t-20">
                                        <h3 class="m-b-0 font-light">爱好</h3><small>书法&amp;音乐&amp;旅游</small>
                                    </div>
                                    <div class="col-lg-4 col-md-4 m-t-20">
                                        <h3 class="m-b-0 font-light">星座</h3><small>巨蟹座</small>
                                    </div>
                                    <div class="col-md-12 m-b-10"></div>
                                </div>
                            </div>
                        </div>
                        <!-- Column -->
                    </div>
                </div>
                <!-- Row -->
                <div class="row">
                    <div class="col-lg-4 col-md-12">
                        <div class="card">
                            <div class="card-body">
                                <h4 class="card-title">通知公告</h4>
                                <h6 class="card-subtitle">仅限公司内部</h6>
                            </div>
                            <!-- ============================================================== -->
                            <!-- Comment widgets -->
                            <!-- ============================================================== -->
                            <div class="comment-widgets">
                                <!-- Comment Row -->
                                <div class="d-flex flex-row comment-row">
                                    <div class="p-2"><span class="round round-warning">项</span></div>
                                    <div class="comment-text active w-100">
                                        <h5>优办公管理信息系统正式上线</h5>
                                        <p class="m-b-5">力啸科技优办公管理信息系统于2018年08月01日正式上线使用。</p>
                                        <div class="comment-footer "> <span class="text-muted pull-right">2018年7月31日</span> <span class="label label-success">系统上线</span></div>
                                    </div>
                                </div>
                                <!-- Comment Row -->
                                <div class="d-flex flex-row comment-row">
                                    <div class="p-2"><span class="round round-danger">规</span></div>
                                    <div class="comment-text w-100">
                                        <h5>2018公司最新规章制度版布执行</h5>
                                        <p class="m-b-5">本制度自发布之日起正式生效，公司全体员工有义务遵守该规章制度。</p>
                                        <div class="comment-footer"> <span class="text-muted pull-right">2018年7月25日</span> <span class="label label-info">公司政策</span></div>
                                    </div>
                                </div>
                                <!-- Comment Row -->
                                <div class="d-flex flex-row comment-row">
                                    <div class="p-2"><span class="round round-warning">项</span></div>
                                    <div class="comment-text active w-100">
                                        <h5>安全生产管理系统第一阶段发布</h5>
                                        <p class="m-b-5">历经3个月的团队努力，安全生产管理系统第一阶段正式发布。</p>
                                        <div class="comment-footer "> <span class="text-muted pull-right">2018年6月3日</span> <span class="label label-success">系统上线</span></div>
                                    </div>
                                </div>
                            </div>
                        </div>
                    </div>
                    <div class="col-lg-4 col-md-12">
                        <div class="card">
                            <div class="card-body bg-primary">
                                <h4 class="text-white card-title">公司资源</h4>
                                <h6 class="card-subtitle text-white m-b-0 op-5">力啸科技资源库</h6>
                            </div>
                            <div class="card-body">
                                <div class="message-box contact-box">
                                    <h2 class="add-ct-btn"><button type="button" class="btn btn-circle btn-lg btn-success waves-effect waves-dark" title="更多">+</button></h2>
                                    <ul class="feeds">
                                        <li>
                                            <div class="bg-inverse"><i class="fa fa-database text-white"></i></div> 固定资产
                                        </li>
                                        <li>
                                            <div class="bg-info"><i class="fa fa-file text-white"></i></div> 项目文件模板
                                        </li>
                                        <li>
                                            <div class="bg-danger"><i class="fa fa-folder text-white"></i></div> 培训材料
                                        </li>
                                        <li>
                                            <div class="bg-primary"><i class="fa fa-wrench text-white"></i></div> 软件&工具
                                        </li>
                                        <li>
                                            <div class="bg-success"><i class="fa fa-book text-white"></i></div> 图书&音乐&视频
                                        </li>
                                        <li>
                                            <div class="bg-danger"><i class="fa fa-photo text-white"></i></div> 软著&软件产品
                                        </li>
                                        <li>
                                            <div class="bg-warning"><i class="fa fa-user text-white"></i></div> 年会&旅游
                                        </li>
                                    </ul>
                                </div>
                            </div>
                        </div>
                    </div>
                    <div class="col-lg-4 col-md-12">
                        <div class="card">
                            <div class="card-body bg-info">
                                <h4 class="text-white card-title">通讯录</h4>
                                <h6 class="card-subtitle text-white m-b-0 op-5">力啸科技员工通讯录</h6>
                            </div>
                            <div class="card-body">
                                <div class="message-box contact-box">
                                    <h2 class="add-ct-btn"><button type="button" class="btn btn-circle btn-lg btn-success waves-effect waves-dark" title="更多">+</button></h2>
                                    <div class="message-widget contact-widget">
                                        <!-- Message -->
                                        <a href="#">
                                            <div class="user-img"> <img src="/static/online/images/users/2.jpg" alt="user" class="img-circle"> <span class="profile-status busy pull-right"></span> </div>
                                            <div class="mail-contnet">
                                                <h5>朱梦娜（Daisy）</h5> <span class="mail-desc">daisy.zhu@lixiaotech.com</span>
                                            </div>
                                        </a>
                                        <!-- Message -->
                                        <a href="#">
                                            <div class="user-img"> <img src="/static/online/images/users/4.jpg" alt="user" class="img-circle"> <span class="profile-status online pull-right"></span> </div>
                                            <div class="mail-contnet">
                                                <h5>别东武（Kyle）</h5> <span class="mail-desc">dongwu.bie@lixiaotech.com</span>
                                            </div>
                                        </a>
                                        <!-- Message -->
                                        <a href="#">
                                            <div class="user-img"> <img src="/static/online/images/users/7.jpg" alt="user" class="img-circle"> <span class="profile-status busy pull-right"></span> </div>
                                            <div class="mail-contnet">
                                                <h5>吴书玲（Cherry）</h5> <span class="mail-desc">cherry.wu@lixiaotech.com</span>
                                            </div>
                                        </a>
                                        <!-- Message -->
                                        <a href="#">
                                            <div class="user-img"> <img src="/static/online/images/users/5.jpg" alt="user" class="img-circle"> <span class="profile-status online pull-right"></span> </div>
                                            <div class="mail-contnet">
                                                <h5>陈欢（Alan）</h5> <span class="mail-desc">alan.chen@lixiaotech.com</span>
                                            </div>
                                        </a>
                                        <!-- Message -->
                                        <a href="#">
                                            <div class="user-img"> <img src="/static/online/images/users/5.jpg" alt="user" class="img-circle"> <span class="profile-status online pull-right"></span> </div>
                                            <div class="mail-contnet">
                                                <h5>陈凯（Kai）</h5> <span class="mail-desc">kai.chen@lixiaotech.com</span>
                                            </div>
                                        </a>
                                        <!-- Message -->
                                        <a href="#">
                                            <div class="user-img"> <img src="/static/online/images/users/8.jpg" alt="user" class="img-circle"> <span class="profile-status busy pull-right"></span> </div>
                                            <div class="mail-contnet">
                                                <h5>任丹妮（Danee）</h5> <span class="mail-desc">danee.ren@lixiaotech.com</span>
                                            </div>
                                        </a>
                                    </div>
                                </div>
                            </div>
                        </div>
                    </div>
                </div>
                <!-- ============================================================== -->
                <!-- End PAge Content -->
                <!-- ============================================================== -->

            </div>
            <!-- ============================================================== -->
            <!-- End Container fluid  -->
            <!-- ============================================================== -->
            <!-- ============================================================== -->
            <!-- footer -->
            <!-- ============================================================== -->
            <footer class="footer">Copyright © 2018 西安力啸网络科技有限公司 版权所有 </footer>
            <!-- ============================================================== -->
            <!-- End footer -->
            <!-- ============================================================== -->
        </div>
        <!-- ============================================================== -->
        <!-- End Page wrapper  -->
        <!-- ============================================================== -->
    </div>
    <!-- ============================================================== -->
    <!-- End Wrapper -->
    <!-- ============================================================== -->
    <!-- ============================================================== -->
    <!-- All Jquery -->
    <!-- ============================================================== -->
    <!--[if lte IE 8]><script src="//ajax.googleapis.com/ajax/libs/jquery/1.11.0/jquery.min.js"></script><![endif]-->
    <!--<script src="js/modernizr-latest.js"></script>-->
    <script src="{% static 'online/js/jquery-1.8.2.min.js' %}"></script>
    <!--<script src="../assets/plugins/bootstrap/js/popper.min.js"></script>-->
    <script src="{% static 'online/js/bootstrap.min.js' %}"></script>
    <!--<script src="{% static 'online/js/custom.min.js' %}"></script>-->

    <script src="{% static 'online/js/user.js' %}"></script>
    <!--<script src="js/jquery.isotope.min.js" type="text/javascript"></script>
    <script src="js/fancybox/jquery.fancybox.pack.js" type="text/javascript"></script>-->
    <!--<script src="{% static 'online/js/jquery.nav.js' %}"></script>-->
    <!--<script src="{% static 'online/js/customdef.js' %}"></script>-->

</body>

</html>
